import Layout from "@/components/layout";

function CourseHead({ course }) {
    return (
        <div className="row">
            <div className="col">
                <h5 className="">
                    <a href="#">{course.name}</a>
                </h5>
            </div>
        </div>
    )
};

export default function CourseLayout({ children, course, title, courseId }) {
    return (
        <Layout title={title}>
            <div className="px-4">
                <CourseHead course={course}></CourseHead>
                <ul className="nav">
                    <li className="nav-item">
                        <a className="nav-link active" aria-current="page" href={`/course/${courseId}`}>简介</a>
                    </li>
                    <li className="nav-item">
                        <a className="nav-link" href={`/course/${courseId}/chapter`}>讲义</a>
                    </li>
                    <li className="nav-item">
                        <a className="nav-link" href={`/course/${courseId}/exercise`}>练习</a>
                    </li>
                </ul>
                <hr />
                {children}
            </div>
        </Layout>
    )
}